import { ref, onMounted, watch, nextTick, } from "vue";
import {
  systemStore
} from "@/store/modules/systemStore";
export const styleWidth = ref<string>('');

//获取底部分页固定的样式
export const useFixeWidth = () => {
  const sysStore = systemStore();
  const sideWidth = ref<number | string>(0)

  //获取真实侧边栏宽度
  watch(() => sysStore.collapseSidebar, (_val, oldVal) => {
    if (_val) {
      sideWidth.value = '60px';
      styleWidth.value = `width: calc(100% - ${sideWidth.value});left: ${sideWidth.value}`;

    } else {
      sideWidth.value = '184px';
      styleWidth.value = `width: calc(100% - ${sideWidth.value});left: ${sideWidth.value}`;

    }
  });
  watch(() => sideWidth.value, (val, old) => {
    styleWidth.value = `width: calc(100% - ${val});left: ${val}`
  })
  sideWidth.value = '184px';
}
